<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>表单中新增的其他属性</title>
</head>
<body>
    <form action="" id="myform">
        <!-- placeholder：提示文本，提示占位 -->
        <!-- autofocus：自动获取焦点 -->
        <!-- autocomplete：自动完成 on：打开 off：关闭
            1、必须成功提交过：提交过才会记录
            2、当前添加 autocomplete 属性的元素必须有 name 属性
        -->
        <p>用户名：<input type="text" name="username" placeholder="请输入用户名" autofocus 
            autocomplete="on"></p>
        <!-- tel 不会实现验证，仅仅是在移动端能够弹出数字键盘 -->
        <!-- required 必须输入，如果没有输入则会阻止当前数据提交 -->
        <!-- pattern 正则表达式验证
            * 代表0个或多个
            ? 代表0个或1个
            + 代表1个或多个
        -->
        <p>手机号：<input type="tel" name="phone" required pattern="^(\+86)?1\d{10}$"></p>
        <!-- 文件 -->
        <!-- multiple 可以选择多个文件
            multiple 在 email 中可以使用逗号分隔的形式填写多个邮箱地址
        -->
        <p>文件：<input type="file" name="file" multiple></p>
        <p>邮箱：<input type="email" name="email" multiple></p>
        <p><input type="submit"></p>
    </form>
    <!-- 下面的元素并没有包含在form中，默认情况下面表单元素数据不会进行提交 -->
    <!-- form 属性值为 form 的id，如果id为form的表单数据提交时，也会将当前表单的数据一起提交 -->
    <input type="text" name="address" form="myform">
</body>
</html>